<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>力行会</title>
	<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
	<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">
	<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/common.css">
	<link rel="stylesheet" href="css/reserve_message.css">
	<link rel="stylesheet" href="css/iconfont.css">

	<script src="./js/jquery-1.9.1.js"></script>
	<script type="text/javascript" src="./js/bootstrap.js"></script>
	<script src="./js/common.js"></script>

</head>
<body>
<header>
	<div class='gray-head'>
		<div class='wrap'>
			<div >
				<a href="javascript:;"  data-toggle="modal" data-target="#login">登录</a> <span>|</span> <a data-toggle="modal" data-target="#register" href="">注册</a>
				<div class="tool quick-tool">
					<div class="searchForm">
						<div class="quickSearch">
							<!-- <input type="text" name="keyword" id="keyword" placeholder="快速搜索" /> -->
							<button >快速搜索<span class="accessible">搜索</span></button>
						</div>
						<div class="searchPanel">
							<div >
								<fieldset class="byDate">
									<div>
										<span>按时间出行</span>
										<a href="javascript:void(0);" class="close">X<span class="accessible">关闭搜索面板</span></a>
									</div>

									<ul>
										<li class='input-group date addDate'>
												<span class="input-group-addon">
			<span class="glyphicon glyphicon-calendar"></span>
		</span>
											<input type="text" /></li>
										<li class='input-group date addDate'>
												<span class="input-group-addon">
			<span class="glyphicon glyphicon-calendar"></span>
		</span>
											<input type="text" /></li>
									</ul>
								</fieldset>
								<fieldset class="byPlace" >
									<div>
										<span>按目的地</span>
									</div>
									<input type="text" placeholder="输入目的地">

								</fieldset>
							</div>
							<div class="actions">
								<i class="iconfont icon-fangdajing"></i>
								<button  type="submit">搜 索</button>
							</div>
						</div>
					</div>
				</div>　
				<div class="tool">
					<a href="javascript:void(0);" class="loginBtn">搜索</a>
				</div>
				<div class="fl">
					<i class="iconfont icon-phone"></i>
					<b> 0571 85865111</b>
				</div>
			</div>
		</div>

	</div>
	<div class="wrap">
		<div class="head-contain">
			<div class="logo"></div>
			<ul>
				<li>首页
				</li>
				<li>目的地
					<div class='xiala'>
						<div class='arrow'>
						</div>
						<a href="">欧洲</a>
						<a href="">美洲</a>
						<a href="">大洋洲</a>
						<a href="">亚洲</a>
						<a href="">非洲</a>
						<a href="">南极</a>
						<a href="">北极</a>
					</div>
				</li>
				<li class='theme-travel'>特色主题旅行
					<i class='hot'></i>
					<div class='xiala'>
						<div class='arrow'>
						</div>
						<a href="">春之芳华</a>
						<a href="">盛夏光年</a>
						<a href="">文艺之秋</a>
						<a href="">冬之恋歌</a>
						<a href="">极地探索</a>
						<a href="">游学考察</a>
						<a href="">养生之旅</a>
						<a href="">环球自驾</a>
					</div>
				</li>
				<li>自由行
					<i class='hot'></i>
					<div class='xiala'>
						<div class='arrow'>
						</div>
						<a href="">日本</a>
						<a href="">希腊</a>
						<a href="">美国</a>
						<a href="">希腊</a>
						<a href="">非洲</a>
						<a href="">南极</a>
						<a href="">北极</a>
					</div>
				</li>
				<li>私人定制</li>
				<li>力行会
					<div class='xiala'>
						<div class='arrow'>
						</div>
						<a href="">渊源</a>
						<a href="">品牌故事</a>
						<a href="">活动.分享</a>
					</div>
				</li>
			</ul>
		</div>
	</div>
</header>

 <div class='wrap'>
 	<div class='top'>	</div>
 	<div class='wrap-left'>
 		<div class='block'>
 			<div class='block-title'>
 				产品预定信息
 			</div>
 			<div class='block-content'>
 				<ul>
 					<li>
 						<h3>产品名称</h3>
 						<p>瑞士“白色冬季”圣莫里茨  纯雪之旅</p>
 					</li>
 					<li>
 						<h3>产品编号</h3>
 						<p>888888</p>
 					</li>
 					<li>	
 						<h3>出行人数 </h3>
 						<p>成人 2位</p>
 					</li>
 					<li>
 						<h3>出发人数 </h3>
 						<p>杭州</p>
 					</li>
 				</ul>
 			</div>
 		</div>

 		<div class='block'>
 			<div class='block-title'>
 				请填写联系人信息
 			</div>
 			<div class='block-content'>
 				<h4>用于核对确认订单信息，收发旅游资料，请准确填写。</h4>
 				<div class='controls'>
 					<p>常用邮箱</p>
 					<input type="text" name="" placeholder="zjcyts@163.com"> <i class='red'> * </i>
 				</div>
 				<div class='controls'>
 					<p>手机号码</p>
 					<input type="text" name="" placeholder="13988888888"><i class='red'> * </i>
 				</div>
 				<div class='controls'>
 					<p>联系人姓名</p>
 					<input type="text" name="" placeholder="张三"><i class='red'> * </i>
 				</div>
 			</div>
 		</div>

 		<div class='block'>
 			<div class='block-title'>
 				请填写出行人信息
 			</div>
 			<div class='block-content traveller-message'>
 				<fieldset>
 					<p>
 						第<b> 1 </b>位游客
 					</p>
 					<div class='controls'>
	 					<p>姓名：</p>
	 					<input type="text" name="" placeholder="请填写中文姓名，例如：张三"> <i class='red'> * </i>
 					</div>
 					<div class='controls'>
	 					<p>手机号码：</p>
	 					<input type="text" name="" placeholder="请输入您的常用手机号码"> <i class='word'> （非必填）填写后便于旅游途中发生状况时，及时与您取得联系。 </i>
 					</div>
 				</fieldset>
 				
 				<fieldset>
 					<p>
 						第<b> 2 </b>位游客
 					</p>
 					<div class='controls'>
	 					<p>姓名：</p>
	 					<input type="text" name="" placeholder="请填写中文姓名，例如：张三"> <i class='red'> * </i>
 					</div>
 					<div class='controls'>
	 					<p>手机号码：</p>
	 					<input type="text" name="" placeholder="请输入您的常用手机号码"> <i class='word'> （非必填）填写后便于旅游途中发生状况时，及时与您取得联系。 </i>
 					</div>
 				</fieldset>

 				<div class='warn'>
 					该产品为稍后确认产品，目前名额紧张，库存和价格须客服人员再次确认。您可先进行预订，填写联系信息，客服人员将在24小时内电话联系您，与您核实预订信息，回复库存和价格情况。
 				</div>
 			</div>
 		</div>
 			<button class='next'>
 				下一步
 			</button>
 	</div>
 	<div class='wrap-right'>
 		<div class='blue-block'>
 			<div class='blue-top'>
 				<h2>我的账单 </h2>
 				<i class='iconfont icon-touxiang'></i>
 			</div>
 			<div class='blue-content'>
 				<div class='detail'>
 					<h4>出游团费</h4>
 					<p>
 						<span>2成人</span>
 						<i> ￥88888</i>
 					</p>
 				</div>
 				<div class='count'>
 					<span>费用合计</span>
 					<i>￥88888</i>
 				</div>
 			</div>
 		</div>
 		<div class='hot-phone'>
 			<span>服务热线</span>
 			<i>0571 85865111</i>
 		</div>
 		
 	</div>
 	
 </div>


<footer >
	<div class="wrapper">
		<div class="footer-top">
			<span>「力行会」是</span>
			<img src="images/zql-logo.png" alt="">
			<span>旗下高端旅行品牌</span>
		</div>
		<div class="footer-bottom">
			<p><span>Copyright © 2016 Uniqueway Inc.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 保留所有权利&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;浙ICP备8888888</span><i>服务时间：周一至周五 9：00~17:30</i></p>
			<p>浙江省中青国际旅游有限公司&nbsp;&nbsp;&nbsp;地址：浙江省杭州市下城区凤起路56号2楼</p>
			<p>*本网站部分图片来自网络，若作者看到，请尽快与力行会联系。</p>
		</div>
	</div>
</footer>

<aside class='contact-way'>
	<div class='contact-contain'>
	   <div class='wx-phone'>
	   	  <div class='phone-contain'>
	   	  	<div class='phone'>
				<img src="./images/icons/phone.png" alt="">
				<div class='phone-detail'>
					0571 85865111
					<p class='triangle-right'></p>
				</div>
			</div>
	   	  </div>
		   <div class='wx-contain'>
		   	<div class='wx'>
				<img src="./images/icons/wx.png" alt="">
				<div class='wx-detail'>
					<img src="./images/icons/wx-big.png" alt="">
					<p class='triangle-right'></p>
				</div>
			</div>
		   </div>
	   </div>
		<div class='arrow'>
			<img src="./images/icons/arrow.png" alt="">
		</div>
	</div>
</aside>	

</body>
</html>